import { Select } from 'antd';
import React, { useState, useEffect } from 'react';
import { TjModal } from '../TjModal';
import { TjModalTitle } from '../TjModal/TjModalTitle';
import { SelectTradeContent } from './SelectTradeContent';
import type { TraderListType } from './SelectTradeContent';
import type { Key } from 'react';

//**
//
//  该组件为交易选择组件，未完善，后续需要用在完善
//
//  */
const TjTrader: React.FC<ITjTraderProps> = (props) => {
  const [selectShowStr, setSelectShowStr] = useState<string>('请联系管理员开通权限');
  const [value, setValue] = useState<Key[]>([]);

  const open = () => {
    TjModal.open({
      title: <TjModalTitle title="交易员" />,
      width: 560,
      notContentBorder: true,
      okText: '提交',
      content: <SelectTradeContent traderList={props.traderList} />,
      onOk: (value) => {
        // if (value && value.length > 0) {
        //   const stationIds = value.map((v: DataNode) => v.key);
        //   props.onChange && props.onChange(stationIds);
        // }
      },
    });
  };

  return (
    <div>
      <Select style={{ width: '100%' }} open={false} value={selectShowStr} onClick={open} />
    </div>
  );
};

interface ITjTraderProps {
  traderList: TraderListType[];
  onChange?: (value: string) => void;
  value?: Key[];
}

export { TjTrader };
